<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Conduit</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link rel="icon" href="/favicon.ico" />
  <!-- <link href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css"> -->
  <!-- <link href="//fonts.googleapis.com/css?family=Titillium+Web:700|Source+Serif+Pro:400,700|Merriweather+Sans:400,700|Source+Sans+Pro:400,300,600,700,300italic,400italic,600italic,700italic" rel="stylesheet" type="text/css"> -->
  <!-- Main CSS -->
  <link href="./assets/css/main.css" rel="stylesheet"/>
  <!-- Animation CSS -->
  <link href="./assets/css/vendor/aos.css" rel="stylesheet"/>
  <!-- <link type="text/css" href="./assets/css/theme.css" rel="stylesheet"> -->

  <!-- <link rel="stylesheet" href="//demo.realworld.io/main.css"> -->
</head>
<body>

<!--------------------------------------
JAVASCRIPTS
--------------------------------------->    
<script src="./assets/js/vendor/jquery.min.js" type="text/javascript"></script>
<script src="/assets/js/vendor/popper.min.js" type="text/javascript"></script>
<script src="/assets/js/vendor/bootstrap.min.js" type="text/javascript"></script>
<!-- <script src="./assets/js/vendor/aos.js" type="text/javascript"></script> -->
<script src="./assets/js/vendor/share.js" type="text/javascript"></script>
<script src="./assets/js/functions.js" type="text/javascript"></script>
    
<!-- Animation -->
<!-- <script>
  AOS.init({
      duration: 700
  });
</script> -->

<!-- Disable animation on less than 1200px, change value if you like -->
<!-- <script>
AOS.init({
disable: function () {
  var maxWidth = 1200;
  return window.innerWidth < maxWidth;
}
});
</script> -->
  
<!-- Carousel Height Smooth -->
<script>    
  $('.carousel').on('slide.bs.carousel', function (event) {
    var height = $(event.relatedTarget).height();
    var $innerCarousel = $(event.target).find('.carousel-inner');
    $innerCarousel.animate({
      height: height
    });
  });
  </script>
  
<!-- Popovers -->
<script>
  $(function () {
    $('[data-toggle="popover"]').popover()
  })
  $('.popover-dismiss').popover({
    trigger: 'focus'
  })
  $(document).ready(function() {
    $("body").on("click", "[data-action]", function(e) {

        e.preventDefault();

        var $this = $(this);
        var action = $this.data('action');
        var target = '';

        switch (action) {
            case "offcanvas-open":
                target = $this.data("target"), $(target).addClass("open"), $("body").append('<div class="body-backdrop" data-action="offcanvas-close" data-target=' + target + " />");
                break;
            case "offcanvas-close":
                target = $this.data("target"), $(target).removeClass("open"), $("body").find(".body-backdrop").remove();
                break;

            case 'aside-open':
                target = $this.data('target');
                $this.data('action', 'aside-close');
                $this.addClass('toggled');
                $(target).addClass('toggled');
                $('.content').append('<div class="body-backdrop" data-action="aside-close" data-target='+target+' />');
                break;


            case 'aside-close':
                target = $this.data('target');
                $this.data('action', 'aside-open');
                $('[data-action="aside-open"], '+target).removeClass('toggled');
                $('.content, .header').find('.body-backdrop').remove();
                break;
        }
    })
});
  </script>
  
<!-- Tooltips -->
<script>
  $(function () {
    $('[data-toggle="tooltip"]').tooltip()
  })
</script>
<script type="module" src="/src/main.ts"></script>
<div id="app"></div>

</body>
</html>
